<template>
  <z-form-item v-if="basicForm?.isShow == '1'" class="z-form-item divider-item">
    <z-divider
      :orientation="formForm.align"
      :dashed="formForm?.lineType === '0'"
      :style="{
        width: formForm?.lineLength ? formForm?.lineLength + '%' : '100%',
      }"
      :class="{
        solidColor: formForm?.lineType === '1',
        dashedColor: formForm?.lineType === '0',
      }"
    >
      <!-- height: formForm?.lineWidth ? formForm?.lineWidth + 'px' : '1px', -->
      {{ formForm.lineText }}
    </z-divider>
  </z-form-item>
</template>
<script>
import { defineComponent, toRef, computed } from 'vue'

export default defineComponent({
  name: 'DividerItem',
  props: {
    formProperty: {
      type: Object,
      default: undefined
    },
    basicProperty: {
      type: Object,
      default: undefined
    },
    formModel: {
      type: Object,
      default: undefined
    }
  },
  setup(props) {
    const basicForm = toRef(props, 'basicProperty')
    const formForm = toRef(props, 'formProperty')
    const model = computed(() => (props.formModel ? props.formModel : {}))

    return {
      basicForm,
      model,
      formForm
    }
  }
})
</script>
<style lang="less" scoped>
.z-form-item{
  flex: 1;
}
</style>
